<template>
  <view>
    <view class="coupon" v-for="(item, i) in dataList" :key="i">
      <view class="top">
        <view class="left">
          <view class="title"
            >{{ item.couponName }}
            ({{
              item.couponType == 'KNOCK'
                ? '立减' + item.amount + '元'
                : '满' + item.fullAmount + '减' + item.amount + '元'
            }})
          </view>
        </view>
        <view class="right">
          <view
          
            class="btn getBtn"
            :class="{ collect: !item.canCollect, bc: refresh[i]}"
            @click="toGet(item, i)"
            >{{!item.canCollect?'已领取':'立即领取'}}
            </view>
  
        </view>
      </view>
      <view class="bottom">
        <view class="time">
          <text>有效期: </text>
          <text>{{ item.validTime }}</text>
         
        </view>
        <view class="info" @click="fold(i)">
          <text style="margin-right: 15rpx">规则详情</text>
          <u-icon v-if="openData[i]" name="arrow-right" color="#999" size="28"></u-icon>
          <u-icon v-else name="arrow-down" color="#999" size="28"></u-icon>
        </view>
      </view>
      <view class="details" v-if="openData[i]">
        <view>1、优惠金额：{{ item.amount }}元</view>
        <view
          >2、每个账号限领次数：{{ item.getMax ? item.getMax : 1 }}次</view
        >
        <view>3、仅限 {{ item.activityName}} 活动中使用</view>
        <!-- <view>4、{{item.remark}}</view> -->
      </view>
    </view>
  </view>
</template>

<script>
export default {
  props: {
    state: Number,
    dataList: Array,
    backpage: {
      type: String,
      default: ''
    },
    backType: {
      type: Number,
      default: 1
    },
    supplierId: {
      type:Number,
      default:''
    }
  },
  data() {
    return {
      whether: false,
      isOpen: '',
      myId: '',
      couponId: '',
      openData: [],
      // collect:''
      change: '',
      refresh: [],
    }
  },
  watch: {
    dataList: function (newVal, oldVal) {
 
      for (let i = 0; i < this.dataList.length; i++) {
        this.openData.push(false)
      
      }
    },
  },
  mounted() {

    for (let i = 0; i < this.dataList.length; i++) {
      this.openData.push(false)
      this.refresh.push(false)
      // console.log('this.refresh', this.openData)
      // console.log('this.refresh', this.refresh)
    }
  },
  methods: {
    // 展开说明
    fold(i) {
    
      this.openData.splice(i, 1, !this.openData[i])
    },
    // 去使用
    toBuy() {
      uni.switchTab({
        url: '../../pages/service/service',
      })
    },
    //去领取
    toGet(item, i) {
      
      if(!item.canCollect) return
      var loginRes = this.checkLogin(this.backpage, this.backType)
      if (!loginRes) {
        return
      }
      this.useCuopon(item, i)
    },
    useCuopon(item, i) {
      this.myId = uni.getStorageSync('userId') ? uni.getStorageSync('userId') : ''
      
      this.couponId = item.id

      this.$http
        .post('/api/coupon/v2/collect', {
           "couponId": this.couponId
        })
        .then((res) => {
          if (res.data.code == 20000) {
            uni.showToast({
              title:'领取成功',
              duration: 2000,
            })
            this.$emit('childByValue','received' )
            // this.change = true
            //this.refresh.splice(i, 1, true)
            // 重新请求
            // this.useCuopon()

          } else {
            console.log(res.data)
            uni.showToast({
              icon: 'none',
              title: res.data.msg ? res.data.msg : '领取失败',
              duration: 2000,
            })
            // this.refresh.splice(i,1,true)
            // console.log(this.refresh);
          }
        })
    },
  },
}
</script>

<style lang="scss" scoped>
@import './index.scss';
</style>
